<!DOCTYPE html>
<html lang="en-US">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="../css/index.css">
    <title>A-Keyboard Test</title>
</head>

<body>
    <textarea style="margin: auto; display: block;" id="input" rows="8" cols="80"></textarea>
    <br>
    <div id="main"></div>
    <script type="text/javascript" src="../index.js"></script>
    <script type="text/javascript">
        const keyboard = new aKeyboard.keyboard({
            el: '#main',
            style: {},
            fixedBottomCenter: true
        })

        keyboard.inputOn('#input', 'value')

        keyboard.onclick('Enter', function() {
            alert('oh! 这是自定义事件！它覆盖了原始的回车事件。This is a custom event! It override the original enter event.');
        })

        // keyboard.onclick('*', function() {
        //     alert('oh! 这是自定义事件，它覆盖了所有的键。This is a custom event that covers all the keys.')
        // })
    </script>
</body>

</html>
